<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>REP后台管理系统</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="shortcut icon" href="img/titelogo.png">
    <link rel="icon" type="image/png" href="i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
    <link rel="stylesheet" href="css/amazeui.min.css"/>
    <link rel="stylesheet" href="css/admin.css">
    <link rel="stylesheet" href="css/app.css">

    <!-- 新 Bootstrap4 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <script src="js/echarts.min.js"></script>

</head>

<body  data-type="index">


<header id="hearedid" class="am-topbar am-topbar-inverse admin-header">
    <div class="am-topbar-brand">
        <a href="javascript:;" class="tpl-logo">
            <img  src="img/logo2.png" alt="">
        </a>
    </div>
    <div class="am-icon-list tpl-header-nav-hover-ico am-fl am-margin-right">

    </div>

    <button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-success am-show-sm-only"
            data-am-collapse="{target: '#topbar-collapse'}"><span class="am-sr-only">导航切换</span> <span
            class="am-icon-bars"></span></button>


    <div class="am-collapse am-topbar-collapse" id="topbar-collapse">

        <ul id="load_leve1_menu_id"
            class="am-nav am-nav-pills am-topbar-nav am-topbar-left admin-header-list tpl-header-list">

        </ul>

        <ul class="am-nav am-nav-pills am-topbar-nav am-topbar-right admin-header-list tpl-header-list">
            <li class="am-dropdown" data-am-dropdown data-am-dropdown-toggle>
                <a class="am-dropdown-toggle tpl-header-list-link" href="javascript:;">
                    <span id="username" class="tpl-header-list-user-nick"></span><span class="tpl-header-list-user-ico"> <img
                        id="userPhotoPath"></span>
                </a>
                <ul class="am-dropdown-content">
                    <li><a href="#" onclick="urlpath('/lc/sys/user/personal-info.html','系统设置,个人中心,个人资料')"><span
                            class="am-icon-bell-o"></span> 资料</a></li>
                    <li><a href="#"><span class="am-icon-cog"></span> 设置</a></li>
                    <li><a href="/logout"><span class="am-icon-power-off"></span> 退出</a></li>
                </ul>
            </li>
            <li><a href="/logout" class="tpl-header-list-link"><span
                    class="am-icon-sign-out tpl-header-list-ico-out-size"></span></a></li>
        </ul>
    </div>
</header>


<!-- 产品 -->
<div class="tpl-page-container tpl-page-header-fixed a" id="cp">
    <div class="tpl-left-nav tpl-left-nav-hover">
        <div class="tpl-left-nav-title" id="a">

        </div>
        <div class="tpl-left-nav-list">
            <ul class="tpl-left-nav-menu" id="er">


            </ul>
        </div>
    </div>

</div>





<div class="tpl-content-wrapper" style="height: 680px">
    <div class="container-fluid">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="#" onclick="urlpath('/welcome.html','Home')">Home1</a></li>
        </ol>
    </div>
    <div class="container-fluid">
        <iframe
                src="welcome.html"
                id="iframe"
                frameborder="no"
                marginwidth="0"
                marginheight="0"
                allowtransparency="yes"
                style="width:100%;height:680px;"></iframe>
    </div>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/amazeui.min.js"></script>
<script>
    $(function () {

        $.ajax({
            type: "post",
            url: "/SysUser/queryUser",
            success: function (data) {
                $("#username").text(data.loginId);
                $("#userPhotoPath").prop("src", data.photoPath);
            }
        })
    })

    function urlpath(url, menus) {

        $("#iframe").prop("src", url)
        let menusList = menus.split(',');
        $(".breadcrumb").html("");
        let li = "<li class=\"breadcrumb-item\"><a href=\"#\" onclick='urlpath(\"/welcome.html\",\"Home\")'>Home</a></li>";
        $.each(menusList, function (i, menu) {
            if (i == menusList.length - 1) {
                li += "<li class='breadcrumb-item active' href='#'>" + menu + "</li>";
            } else {
                li += "<li class='breadcrumb-item'><a href='#'>" + menu + "</a></li>";
            }

        })
        $(".breadcrumb").append(li);
    }

    var menuMap = null;
    // *************************************动态菜单实现************************************
    //     异步获取当前登录用户的一级菜单
    $(function () {
        $.ajax({
            type: "POST",
            url: "/sys/load_menus_id",
            success: function (menudata) {
                // menudata.getKey("产品设计");
                menuMap = menudata;
                // console.log(menudata)
                var f=0;
                $.each(menudata, function (index, value) {
                    console.log(index)
                    $("#load_leve1_menu_id").append("<li class=\"am-dropdown\"  data-am-dropdown data-am-dropdown-toggle>" +
                        "<a class=\"am-dropdown-toggle tpl-header-list-link hh\" onclick=\"ch('"+index+"')\">" +
                        "<span class=\"am-icon-calendar\"></span>" + index + "</span>" +
                        "</a>" +
                        "</li>");

                    if(f==0){
                        f+=1;
                        $("#a").text(index);
                        $.each(value,function (ii,value) {
                            var co="";
                            $.each(value,function (i,val) {
                                co+="<li>" +
                                    "<a onclick=\"urlpath('"+val.linkUrl+"','"+index+","+ii+","+val.name+"')\">" +
                                    "<i class=\"am-icon-angle-right\"></i>" +
                                    "<span>"+val.name+"</span>" +
                                    "</a>" +
                                    "</li>";
                            })
                            $("#er").append("<li class='tpl-left-nav-item'>" +
                                "  <a onclick='s(this)' href=\"javascript:;\" class=\"nav-link tpl-left-nav-link-list\">" +
                                " <i class=\"am-icon-table\"></i>" +
                                "<span>" + ii + "</span>" +
                                "  <i class=\"am-icon-angle-right tpl-left-nav-more-ico am-fr am-margin-right\"></i>" +
                                "</a>" +
                                "<ul  class='tpl-left-nav-sub-menu'>"+co+"</ul>" +
                                "</li>");


                        })
                    }


                });
            }
        })

    })
    function ch(data) {
        // $(".a").each(function () {
        //     $(this).hide();
        // })
        // $("#" + data).show()
        // alert(data);
        $("#er").html("");
        $.each(menuMap, function (ie, value) {
            // console.log("ie----"+ie)
          if(ie==data){
              $("#a").text(data);
              $.each(value,function (index,value) {
                  // console.log("index----"+index)
                  var co="";
                  $.each(value,function (i,val) {
                      // console.log("i----"+i)
                      co+="<li>" +
                          "<a onclick=\"urlpath('"+val.linkUrl+"','"+ie+","+index+","+val.name+"')\">" +
                          "<i class=\"am-icon-angle-right\"></i>" +
                          "<span>"+val.name+"</span>" +
                          "</a>" +
                          "</li>";
                  })
                  $("#er").append("<li class='tpl-left-nav-item'>" +
                              "  <a onclick='s(this)' href=\"javascript:;\" class=\"nav-link tpl-left-nav-link-list\">" +
                              " <i class=\"am-icon-table\"></i>" +
                              "<span>" + index + "</span>" +
                              "  <i class=\"am-icon-angle-right tpl-left-nav-more-ico am-fr am-margin-right\"></i>" +
                              "</a>" +
                                "<ul  class='tpl-left-nav-sub-menu'>"+co+"</ul>" +
                              "</li>");


              })
          }

        })

    }
    function s(data) {
      //  console.log( $(data).next())
        $(data).next().toggle();

    }

</script>

<script src="js/app.js"></script>
</body>
</html>